The square should be a uniform shade of green.
<div style="width: 100px; height: 50px; background-color: green; opacity: 0.5;"></div>
<span style="opacity: 0.9">
    <div id="inner" style="float: left; width: 100px; height: 100px; overflow: hidden;">
        <span style="display: inline-block; width: 100px; height: 50px; background-color: green; opacity: 0.5;"></span>
    </div>
</span>
<script src="../../resources/run-after-layout-and-paint.js"></script>
<script>
    if (window.testRunner)
        testRunner.waitUntilDone();
    runAfterLayoutAndPaint(function() {
        document.getElementById("inner").style.float = "none";
        if (window.testRunner)
            testRunner.notifyDone();
    });
</script>
